<template>
  <div class="cluster recovery">
    <a-card style="width: 100%">
      <p slot="title" class="cardTitles">
        <span>重点人统计</span>
      </p>
      <div class="formDiv">
        <a-form layout="inline">
          <a-row >
              <a-form-item label="时间">
                <a-range-picker v-model="selectDate" />
              </a-form-item>
              <a-form-item>
                <a-button type="primary" @click="search">搜索</a-button>
              </a-form-item>
          </a-row>
        </a-form>
      </div>
      <div style="margin-top: 20px" class="table-content">
        <a-table
          bordered
          :columns="columns"
          :data-source="list"
          rowKey="id"
          :loading="loading"
          :pagination="pagination"
          @change="employeeChangePage"
        >
          <template slot-scope="text, record" slot="action">
            <a class="tools" @click="detail(record)">详细分析</a>
          </template>
        </a-table>
      </div>
    </a-card>
  </div>
</template>

<script>
import moment from 'moment';
import {
  getEmployeeList,
  deleteEmployee,
} from "@/api/employee";
import addModel from "components/configuration/employee/addModel";
import { paging } from "assets/js/mixin";
export default {
  mixins: [paging],
  components: {
    addModel,
  },
  data() {
    return {
      loginUserAuth: JSON.parse(localStorage.getItem("userInfo")).auth,
      selectDate:[],//选择时间
      //三级联动
      sectionData: [],
      shopData: [],
      groupData: [],
      loading: false,
      //是否显示弹框
      managementVisible: false,
      managementId: null,
      managementType: 0, //0新增1是编辑
      //搜索字段
      account: "",
      section: "",
      shop: "",
      group: "",
      sex: "",
      jobCardID: "",
      occupation: "",
      postType: "",
      post: "",
      name: "",
      selectedRowKeys: [],
      columns: [
        {
          title: "用户名",
          dataIndex: "account",
          scopedSlots: { customRender: "objectName" },
        },
        {
          title: "姓名",
          dataIndex: "name",
        },
        {
          title: "性别",
          dataIndex: "sex",
        },
        {
          title: "工号",
          dataIndex: "workerID",
        },
        {
          title: "工作证号",
          dataIndex: "jobCardID",
        },
        {
          title: "所在站段",
          dataIndex: "section",
        },
        {
          title: "所在班组",
          dataIndex: "group",
        },
        {
          title: "所在车间/科室	",
          dataIndex: "shop",
        },
        {
          title: "职名（工种）",
          dataIndex: "occupation",
        },
        {
          title: "岗位",
          dataIndex: "post",
        },
        {
          title: "岗位类型",
          dataIndex: "postType",
        },
        {
          title: "操作",
          dataIndex: "action",
          align: "center",
          scopedSlots: { customRender: "action" },
        },
      ],
      list: [],
      treeArr: {},
      formLayout: {
        spanCol: { span: 6 },
        wrapperCol: { span: 18 },
      },
      inputValue: "",
    };
  },
  mounted() {
    this.getEmployeeList();
  },
  methods: {
    //详细分析
    detail(record){

    },
    //搜索
    search() {
      this.pageNum = 1;
      this.pagination.current = 1;
      this.getEmployeeList();
    },
    //分页操作
    employeeChangePage(pagination) {
      this.pageNum = pagination.current;
      this.pagination.current = pagination.current;
      this.pagination.pageSize = pagination.pageSize;
      this.getEmployeeList();
    },
    getEmployeeList() {
      this.loading = true;
      var params = {
        page: this.pageNum,
        limit: this.pageSize,
        account: this.account,
        section: this.section,
        shop: this.shop,
        group: this.group,
        sex: this.sex,
        jobCardID: this.jobCardID,
        occupation: this.occupation,
        post: this.post,
        postType: this.postType,
        name: this.name,
      };
      getEmployeeList(params)
        .then((res) => {
          this.list = res.data.employees;
          this.pagination.total = res.data.total;
          this.loading = false;
        })
        .catch((err) => {
          this.$message.destroy();
          this.$message.error(err);
        });
    },
  },
};
</script>

<style lang="stylus" scoped>
.formDiv {
  .lable {
    margin-right: 10px;
  }
}

.upload {
  float: right;
}

.recovery {
  height: 100%;
}

.table-content {
  height: calc(100% - 138px);
  overflow: auto;
}

.ant-card-body {
  height: 100%;
}
</style>